<template>
	<view>
		<uni-list>
			<uni-list-item v-for="(item, index) in dataList" :key="index" :show-extra-icon="true" showArrow
				:title="item.title" clickable="true" :extra-icon="extraIcon" :note="item.dataTime" link="navigateTo"
				@click="jump(item.orderId)" />
		</uni-list>
	</view>
</template>

<script>
	export default {
		name: "autoApprovalPending",
		data() {
			return {

				dataList: [],
				extraIcon: {
					color: '#409EFF',
					size: '40',
					type: 'email-filled'
				},
			};
		},
		methods: {
			getTodoList() {
				uni.request({
					url: "http://localhost:8088/getTodoUndoneList?userId=" + localStorage.getItem("userId"),
					method: "GET",
					success: (res) => {
						if (res.data && res.data.code === '0') {
							const todoList = res.data.data;

							// 过滤符合条件的 todo
							this.dataList = todoList
								.filter(item => item.todoType === '用车申请部门审批' && item.todoStatus === '未完成')
								.map(item => ({
									title: '您有一条用车审批待处理',
									dataTime: item.todoTime,
									orderId: item.orderId,
									// 其他属性根据实际情况设置
								}));
						} else {
							console.error('Error fetching data. Server response:', res);
						}
					},
					fail: (error) => {
						console.error('Error fetching data:', error);
					}
				});
			},

			jump(orderId) {
				uni.navigateTo({
					url: "/pages/autoDepartmentApproval/autoDepartmentApproval?orderId=" + orderId
				})
			}
		},
		created() {
			this.getTodoList();
		}
	};
</script>

<style lang="scss">
	.slot-box {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		align-items: center;
	}

	.slot-image {
		/* #ifndef APP-NVUE */
		display: block;
		/* #endif */
		margin-right: 10px;
		width: 30px;
		height: 30px;
	}

	.slot-text {
		flex: 1;
		font-size: 14px;
		color: #4cd964;
		margin-right: 10px;
	}
</style>